<script type="text/javascript">
$(document).ready(function()
				{
    //text2 la cái class ở ctable
				$(".text2").blur(function(){
				    //1 cái ô
											$cellvalue = $(".cellvalue").val();
											$tong =$('.tong'+$(this).get(0).id).val();
											$value=$(this).val();
											$cellvalue = parseInt($cellvalue,10);
											$tong =parseInt($tong,10);
											$value=parseInt($value,10);
											if (isNaN($cellvalue))
												$cellvalue=0;
											if (isNaN($tong))
												$tong=0;
											if (isNaN($value))
											{
												$value=0;
												$(this).val(0);
											}
											$tong = $tong + $value - $cellvalue;
											$('.tong'+$(this).get(0).id).val($tong);
										});

				$(".text2").focus(function(){
					$(".cellvalue").val($(this).val());
				});
				
				$(".text1").keydown(function(e) {
			        if ( e.keyCode == 46 || e.keyCode == 8  || e.keyCode == 9) {}
			        else {
			            if (e.keyCode < 48 || e.keyCode > 57 ) {
			                e.preventDefault(); 
			            }   
			        }
			    });
				$(".text2").keydown(function(e) {
			        if (  e.keyCode == 8  || e.keyCode == 9) {}
			        else {
			            if ((e.keyCode < 46 || e.keyCode > 57 ) {
			                e.preventDefault(); 
			            }   
			        }
			    });
				}
	);

</script>



.th{background:blue;color:white;border:1px solid #000;}
A:link {COLOR: #0000EE;}
A:hover {COLOR: #0000EE;}
A:visited {COLOR: #0000EE;}
A:hover {COLOR: #0000EE;}

.div_freezepanes_wrapper{
position:relative;width:90%;height:400px;
overflow:hidden;background:#fff;border-style: ridge;
}

.div_verticalscroll{
position: absolute;right:0px;width:18px;height:100%;
background:#EAEAEA;border:1px solid #C0C0C0;
}

.buttonUp{
width:20px;position: absolute;top:2px;
}

.buttonDn{
width:20px;position: absolute;bottom:22px;
}

.div_horizontalscroll{
position: absolute;bottom:0px;width:100%;height:18px;
background:#EAEAEA;border:1px solid #C0C0C0;
}

.buttonRight{
width:20px;position: absolute;left:0px;padding-top:2px;
}

.buttonLeft{
width:20px;position: absolute;right:22px;padding-top:2px;
}
</style>

<div>
<h3>Freeze Panes html table like Excel in a scrollable div - Demo 2</h3>

This is version 2 as an interin to a new release. Note pane is freezed at 2nd column and second row.<br/>

Change variables var freezeRow=2; //change to row to freeze at - var freezeCol=2; //change to column to freeze at.
<br/><br/>
<div>&nbsp;<a href="freezepains_table.php">Back to Article</a>&nbsp;&nbsp;&nbsp;<a href="http://www.codeproject.com/KB/scripting/FreezePanes.aspx" target="blank">Code Project Article</a></div>

<div class="div_freezepanes_wrapper">

<div class="div_verticalscroll" onmouseover="this.style.cursor='pointer'">
	<div style="height:50%;" onmousedown="upp();" onmouseup="upp(1);"><img class="buttonUp" src="../img/uF035.png"></div>
	<div style="height:50%;" onmousedown="down();" onmouseup="down(1);"><img class="buttonDn" src="../img/uF036.png"></div>
</div>

<div class="div_horizontalscroll" onmouseover="this.style.cursor='pointer'">
	<div style="float:left;width:50%;height:100%;" onmousedown="right();" onmouseup="right(1);"><img class="buttonRight" src="../img/uF033.png"></div>

	<div style="float:right;width:50%;height:100%;" onmousedown="left();" onmouseup="left(1);"><img class="buttonLeft" src="../img/uF034.png"></div>
</div>
<div id="tabs">
<ul>
        <li id="current">
            <?php echo $this->Html->link(__('Danh sách công việc', true), 
                        array('action' => 'sua',$kehoach)) ;  
            ?>
        </li>
        <li>
            <?php echo $this->Html->link(__('Giao việc', true), 
                        array('action' => 'giaoviec',$kehoach),NULL, sprintf(__('Bạn có chắc muốn giao các công việc này cho nhân viên? Chú ý bạn sẽ KHÔNG ĐƯỢC PHÉP SỬA/XÓA công việc sau khi thực hiện thao tác này, BẠN CẦN LƯU CÔNG VIỆC TRƯỚC KHI THỰC HIỆN CÔNG VIỆC NÀY', true)))
            ;  
            ?>
        </li>
      
        <li>
        <?php
        echo $this->Html->link(__('Các kế hoạch khác', true), array('controller'=>'z1chithikhs', 'action' => 'index',$this->Session->read('cur_dv'))); 
             
        ?>
        </li>
</ul>
</div>
<div class="kqbanhangs">
<h2><?php 
            echo $kh['Donvi']['tendv'].'<br></h2>';
           echo '<h4>';
 
            echo $kh['Thoigian']['tentg'];
            echo ' Từ:'.$kh['Thoigian']['ngaybd'].' đến '.$kh['Thoigian']['ngaykt'].'</h4>';
    ?>
<h3>Công việc theo kế hoạch tuần</h3>
<table id="tables" align="center" style="margin-bottom: 20px;"><tr><th>(1)</th><th>(2)</th><th>(3)</th><th>(4)</th></tr>
<tr><td>Nhiệm vụ</td><td>Chỉ tiêu</td><td>Kết quả</td><td>% hoàn thành</td></tr></table>
<h4 style="margin-bottom: 20px;">Nếu 1 nhân viên có nhiều công việc trong cùng 1 ngày, bạn thêm 1 dòng mới bằng cách chọn "Thêm" ở cột bên phải ở ngay nhân viên đó</h4>
<?php echo $this->Html->link(__('Xuất Excel', true), 
                        array('action' => 'excel',$kehoach)) ;  
            ?>
<br />
<?php echo $this->Form->create('Nvngay',array('url'=>'luu1/'.$kehoach));?>
<div style="width:2000px; overflow:auto">
<?php   
       
    echo $ctable->Edittask('Nvngay',$nhanviens,$dulieu,1);
?>
</div>
</div>

<br><br>
</div>
  <script type="text/javascript">
  //****Copywrite CoastWorx http://www.coastworx.com Version 1.1******
  //****Please make a donation if you wish to remove this notice!******
  var freezeRow=2; //change to row to freeze at
  var freezeCol=2; //change to column to freeze at
  var myRow=freezeRow;
  var myCol=freezeCol;
  var speed=100; //timeout speed
  var myTable;
  var noRows;
  var myCells,ID;



function setUp(){
	if(!myTable){myTable=document.getElementById("t1");}
 	myCells = myTable.rows[0].cells.length;
	noRows=myTable.rows.length;

	for( var x = 0; x < myTable.rows[0].cells.length; x++ ) {
		colWdth=myTable.rows[0].cells[x].offsetWidth;
		myTable.rows[0].cells[x].setAttribute("width",colWdth-4);

	}
}


function right(up){
	if(up){window.clearTimeout(ID);return;}
	if(!myTable){setUp();}

	if(myCol<(myCells)){
		for( var x = 0; x < noRows; x++ ) {
			myTable.rows[x].cells[myCol].style.display="";
		}
		if(myCol >freezeCol){myCol--;}
		ID = window.setTimeout('right()',speed);
	}
}

function left(up){
	if(up){window.clearTimeout(ID);return;}
	if(!myTable){setUp();}

	if(myCol<(myCells-1)){
		for( var x = 0; x < noRows; x++ ) {
			myTable.rows[x].cells[myCol].style.display="none";
		}
		myCol++
		ID = window.setTimeout('left()',speed);

	}
}

function down(up){
	if(up){window.clearTimeout(ID);return;}
	if(!myTable){setUp();}

	if(myRow<(noRows-1)){
			myTable.rows[myRow].style.display="none";
			myRow++	;

			ID = window.setTimeout('down()',speed);
	}
}

function upp(up){
	if(up){window.clearTimeout(ID);return;}
	if(!myTable){setUp();}
	if(myRow<=noRows){
		myTable.rows[myRow].style.display="";
		if(myRow >freezeRow){myRow--;}
		ID = window.setTimeout('upp()',speed);
	}
}

</script>






<?php echo $this->Form->end(__('Lưu', true));?>

</div>